<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/food.css" rel="stylesheet">
    <title>菜品列表</title>
</head>
<body>

<div class="main">
    <div class="back_btn" onclick="window.order.finish()"></div>
    <div class="header">
        商品列表
    </div>
    <div class="main_up padding_top_40">
        <div class="food_list container-fluid J_food_list_cantainer">
            <!-- 行 -->
            <!------------------------------- 菜品模板 start------------------------------->
            <div class="row J_food_item_template hidden">
                <!-- 图片 固定宽度 -->
                <div class="img col-xs-4 J_img J_href">
                    <img src="" alt=""/>
                </div>

                <div class="food_info col-xs-8">

                    <div class="food_info_up">
                        <!-- 菜品名称 -->
                        <div class="food_name J_food_name J_href" data_name="">名称</div>
                        <!-- 库存数量 -->
                        <div class="food_stock">
                            库存<span class="count J_stock">200</span>份
                        </div>
                    </div>

                    <div class="food_info_down row">
                        <!-- 价格 -->
                        <div class="food_price col-xs-6">
                            ¥<span class="price J_price" data_price="">15.0</span>
                        </div>
                        <!-- 操作 -->
                        <div class="action col-xs-6 J_action" data_goodsId="">
                            <!-- 减少 -->
                            <span class="subtract col-xs-3 J_subtract hidden"></span>
                            <!-- 数量 -->
                            <span class="count col-xs-6 J_count hidden" data_num="0">0</span>
                            <!-- 增加 -->
                            <span class="add col-xs-3 J_add"></span>
                        </div>
                    </div>
                </div>
            </div>
            <!------------------------------- 菜品模板 end------------------------------->
            <!-- 菜品模板 end-->
        </div>
    </div>

    <!-- 底部 -->
    <div class="footer container-fluid">
        <div class="checkbox J_shopping_car_btn"></div>
        <div class="row">
            <div class="shopping_car col-xs-8 empty">
                <div class="row">
                    <!-- 购物车图标 -->
                    <div class="shopping_car_icon col-xs-3">
                        <!-- 总数量 -->
                        <div class="food_amount J_shopping_car_count" data_count="0">0</div>
                    </div>
                    <!-- 金额 -->
                    <div class="shopping_car_amount col-xs-8 J_shopping_car_amount" data_amount="0">¥ 0</div>
                    <div class="shopping_car_amount_empty col-xs-8">空空的~</div>
                </div>
            </div>
            <div class="buy col-xs-4 J_buy disabled">
                下单
            </div>
        </div>
    </div>

    <!-- 购物车弹出层 start-->
    <div class="bg_cover shopping_car_pop" id="shopping_car_pop">
        <div class="goods_list container-fluid shopping_car_list">
            <div class="row title goods_list_title">
                <div class="goods_list_title_text">购物车</div>
                <div class="clear_car">
                    <span class="clear_car_icon">
                        <img src="../imgs/ic_clean.png" alt=""/>
                    </span>
                    <span class="clear_car_text"> 清空 </span>
                </div>
            </div>
            <div class="list container-fluid goods_list_item J_goods_list_item_cantainer">
                <!------------------------------------------- 模板 start------------------------------------------->
                <div class="row J_goods_list_item_template hidden">
                    <div class="col-xs-5 J_goods_name">香酥鸡腿</div>
                    <div class="col-xs-3 price_font price J_goods_price" data_price="0">¥ 15</div>
                    <!-- 操作 -->
                    <div class="action col-xs-4 J_action" data_goodsId="">
                        <!-- 减少 -->
                        <span class="subtract col-xs-3 J_subtract"></span>
                        <!-- 数量 -->
                        <span class="count col-xs-6 J_count" data_num="0">1</span>
                        <!-- 增加 -->
                        <span class="add col-xs-3 J_add"></span>
                    </div>
                </div>
                <!------------------------------------------- 模板 start------------------------------------------->
            </div>
        </div>
    </div>
    <!-- 购物车弹出层 end-->

    <!-- 爽约提示 -->
    <div class="sy_tips">
        提示：很抱歉，暂时无法下单。由于你近期频繁爽约，系统禁止下单一个月哦~
    </div>
</div>

<div class="alert_popover">
    <!-- 弹出确认框 start-->
    <div class="confirm_popover">
        <div class="row">
            是否清空车内所有商品?
        </div>
        <div class="row">
            <div class="col-xs-6 cancel">取消</div>
            <div class="col-xs-6 confirm">清空</div>
        </div>
    </div>
    <!-- 弹出确认框 end-->
</div>

<script src="../js/commen/zepto.min.js"></script>
<script src="../js/commen/data.js"></script>
<script src="../js/commen/touch.js"></script>
<script src="../js/commen/common.js"></script>
<script src="../js/food.js"></script>
<script src="../js/foodList.js"></script>
</body>
</html>